<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
        content="width=device-width,initial-scale=1.0,viewport-fit=cover,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>尤迈桃李会</title>
    <script src="js/rem.js"></script>
    <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
    <link rel="stylesheet" href="css/weui.min.css">
    <link rel="stylesheet" href="css/jquery-weui.min.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/user.css">
    <link rel="stylesheet" href="css/ot-classroom-index.css">
    <link rel="stylesheet" href="css/ot-doctor-index.css">
    <link rel="stylesheet" href="css/ot-doctor-relevant.css">
    <link rel="stylesheet" href="css/ot-doctor-detail.css">
    <script>(function () { var _53code = document.createElement("script"); _53code.src = "https://tb.53kf.com/code/code/96d8f960b261e49515450f8953b044bc5/1"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(_53code, s); })();</script>
</head>

<body>
    <div class="pub_bar" title="名医讲习所" left="back" right="menu"></div>
    <!--  -->
    <div class="pub-container has-tabbar  bgwhite" id="main">
        <!-- 公共部分 - header -->
        <header class="pub-header">
            <div class="header-box">
                <input type="text" class="search" placeholder="癫痫病">
                <div class="footprint">足迹</div>
                <a href="./ot-signIn.html">
                    <div class="sign-in">签到</div>
                </a>
            </div>
        </header>
        <!--  -->
        <ul class="main-titles" id="selectLevel">
            <li>一级科室</li>
            <li>二级科室</li>
            <li>疾病</li>
            <li>专家</li>
        </ul>
        <!-- 全部课程 / 短视频/片花 -->
        <div class="hot-course space-border">
            <div class="hxl_tabs">
                <div class="tabs_item active" dom='#list1'>全部课程</div>
                <div class="tabs_item" dom='#list1''>短视频/片花</div>
            </div>
            <!-- 列表 -->
            <div class="relevant_listing">
                <div class="relevant_list" style="display: block;">
                    <div class="hot-course">
                        <li class="list_item space-border">
                            <div class="hot_top">
                                <p>231人正在学习｜38万次播放</p>
                                <p>2021-03-15上线</p>
                            </div>
                            <div class="hot_center">
                                <div class="hot_left">
                                    <div class="hot_p1">共7讲</div>
                                    <img class="hot_img" src="" alt="">
                                    <div class="hot_p2">范洪伟 专家</div>
                                </div>
                                <div class="hot_right">
                                    <div class="hot_p3 text-cut-one">XXXX专家xxxx科系列课程</div>
                                    <div class="hot_p4">专家姓名 职称</div>
                                    <div class="hot_p4">医院医院医院医院 科室</div>
                                    <div class="hot_p5">癫痫病 内科 癫痫病</div>
                                    <a href="./ot-doctor-detail.html">
                                        <div class="hot_btn">开始听课</div>
                                    </a>
                                </div>
                            </div>
                        </li>
                        <li class="list_item space-border">
                            <div class="hot_top">
                                <p>231人正在学习｜38万次播放</p>
                                <p>2021-03-15上线</p>
                            </div>
                            <div class="hot_center">
                                <div class="hot_left">
                                    <div class="hot_p1">共7讲</div>
                                    <img class="hot_img" src="" alt="">
                                    <div class="hot_p2">范洪伟 专家</div>
                                </div>
                                <div class="hot_right">
                                    <div class="hot_p3 text-cut-one">XXXX专家xxxx科系列课程</div>
                                    <div class="hot_p4">专家姓名 职称</div>
                                    <div class="hot_p4">医院医院医院医院 科室</div>
                                    <div class="hot_p5">癫痫病 内科 癫痫病</div>
                                    <a href="./ot-doctor-detail.html">
                                        <div class="hot_btn">开始听课</div>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </div>
                </div>
                <div class="relevant_list">
                    <div class="doctorInfo">
                        <video class="doctorInfo_img" src="./image/placeholder/1.mp4"
                            poster="./image/hxl/hxl-doctor01.png"></video>
                        <div class="play"><img src="./image/hxl/hxl-play.png" alt=""></div>
                        <div class="doctorInfo_cont plr15">
                            <div class="doctorInfo_left">
                                <div class="doctorInfo_text">
                                    <p class="doctorInfo_p1">
                                        <span>范洪伟</span>
                                        <span>主任医师</span>
                                    </p>
                                    <p class="doctorInfo_p2 text-cut-three">北京协和医院北京协和医院北京协和医院北京协和医院北京协和医院北京协和医院北京协和医院北京协和医院</p>
                                </div>
                            </div>
                            <div class="doctorInfo_right">
                                <div class="thumbs active">
                                    <p>20</p>
                                </div>
                                <div class="comment">
                                    <p>20</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--  -->
            <div class="weui-loadmore loadMore">
                <i class="weui-loading"></i>
                <span class="weui-loadmore__tips">正在加载</span>
            </div>
            <div class="weui-loadmore weui-loadmore_line noMore hide">
                <span class="weui-loadmore__tips">没有更多数据了</span>
            </div>
            <!-- 医生相关 - 开始听课 -->
            <div class="hxl_tabs space-border">
                <div class="tabs_item active" dom='#list2'>医生相关</div>
                <div class="tabs_item" dom='#list2'>开始听课</div>
            </div>
            <!-- 列表 -->
            <div class="relevant_listing">
                <div class="relevant_list relevant_list1" style="display: block;">
                    <div class="pub_small_header plr15">
                        <a href="#">
                            <div class="title">精彩瞬间</div>
                            <div class="right">共有7节系列课程<img src="./image/hxl/hxl-right.png" alt=""></div>
                        </a>
                    </div>
                    <div class="item space-border">
                        <a href="./ot-doctor-video.html">
                            <div class="item_img">
                                <img src="/image/placeholder/1.jpg" alt="">
                                <p>开讲时间:2021/02/20/13:00-16:00</p>
                            </div>
                            <div class="item_cont">
                                <p class="text-cut-one">XXX医生课程精彩瞬间</p>
                                <div><img src="./image/hxl/hxl-doctor08.png" alt="">100+</div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="relevant_list relevant_list2">
                    <a href="./ot-classroom-play.html">
                        <div class="item space-border">
                            <div class="item_img">
                                <img src="" alt="">
                                <p>共3系列</p>
                            </div>
                            <div class="item_cont">
                                <p class="item_p1">课程标题xxxx科系列课程课程标题xxxx科系列课程</p>
                                <div class="item_msg">
                                    <p>2021/02/20</p>
                                    <div><img src="./image/hxl/hxl-doctor08.png" alt="">100+</div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="weui-loadmore" id="loadMore">
                <i class="weui-loading"></i>
                <span class="weui-loadmore__tips">正在加载</span>
            </div>
            <div class="weui-loadmore weui-loadmore_line hide" id="noMore">
                <span class="weui-loadmore__tips">没有更多数据了</span>
            </div>
            <!-- 评论 -->
            <div class="comment_cont">
                <div class="comment_title">
                    <p><span>20</span>条评论</p>
                    <img class="comment_close" src="./image/bar-close.png" alt="">
                </div>
                <div class="comment_list">
                    <div class="comment_item">
                        <div class="comment_head"><img src="" alt=""></div>
                        <div class="comment_text">
                            <p class="comment_name text-cut-one">名字名字名字</p>
                            <p class="comment_msg">评论评论评论评论评论评论评论评论评论评论评论评论</p>
                        </div>
                        <div class="comment_live">21</div>
                    </div>
                    <div class="comment_item">
                        <div class="comment_head"><img src="" alt=""></div>
                        <div class="comment_text">
                            <p class="comment_name text-cut-one">名字名字名字</p>
                            <p class="comment_msg">评论评论评论评论评论评论评论评论评论评论评论评论</p>
                        </div>
                        <div class="comment_live">21</div>
                    </div>
                    <div class="comment_item">
                        <div class="comment_head"><img src="" alt=""></div>
                        <div class="comment_text">
                            <p class="comment_name text-cut-one">名字名字名字</p>
                            <p class="comment_msg">评论评论评论评论评论评论评论评论评论评论评论评论</p>
                        </div>
                        <div class="comment_live">21</div>
                    </div>
                </div>
                <div class="mycomment">
                    <div class="mycomment_cont">
                        <div class="mycomment_head"><img src="" alt=""></div>
                        <div class="mycomment_msg"><input type="text" placeholder="请输入评论……"></div>
                    </div>
                    <div class="mycomment_send">发送</div>
                </div>
            </div>
        </div>
        <!-- 公共footer -->
        <div class="pub-footer">
            <ul class="tabs">
                <li class="tab-classroom"><a href="./ot-classroom-index.html">首页</a></li>
                <li class="tab-doctor"><a href="./ot-doctor-index.html">名医</a></li>
                <li class="tab-curriculum active"><a href="./ot-curriculum-index.html">课程</a></li>
                <li class="tab-forum"><a href="#">讲堂</a></li>
                <li class="tab-consultation"><a href="#">会诊</a></li>
                <li class="tab-user"><a href="javascript:;">我的</a></li>
            </ul>
        </div>
    </div>
    <script src="https://g.alicdn.com/de/prismplayer/2.9.3/aliplayer-h5-min.js"></script>
    <script src="js/jquery-3.6.0.min.js"></script>
    <script src="js/jquery-weui.min.js"></script>
    <script src="js/md5.js"></script>
    <script src="js/public.js"></script>
    <script>
        let status = getQueryString('status')
        $(".hxl_tabs").eq(0).find('.tabs_item').eq(status).addClass('active').siblings().removeClass("active")
        $(".relevant_listing").eq(0).find('.relevant_list').eq(status).show().siblings().hide()

        // 选择科室四级
        $('#selectLevel').click(function () {
            $('#main').hide();
            $('#areaModule').show();
        })

        // 搜索结果
        $(document).on('keyup', '.search', function (event) {
            if (event.keyCode == 13) {
            }
        })
    </script>
    <!-- 选择省市乡镇 -->
    <div class="user-choose bgwhite" id="areaModule" style="display: none;">
        <div class="search-box">
            <input class="search" type="text" placeholder="输入医院名称" id="toHospital">
        </div>
        <ul class="main-titles" id="selectLevel">
            <li class="oneLevel">一级科室</li>
            <li class="twoLevel">二级科室</li>
            <li class="disease">疾病</li>
            <li class="expert">专家</li>
        </ul>
        <ul class="main">
            <li class="area-item province" id="provinceList"></li>
            <li class="area-item city" id="cityList"></li>
            <li class="area-item county" id="areaList"></li>
            <li class="area-item town" id="countryList"></li>
        </ul>
        <div class="footer submit-box">
            <input class="pub-submit-btn" id="areaConfirm" type="button" value="确定">
        </div>
    </div>
    <script>
        var proviceData, cityData, areaData;
        // 获取省市区数据
        http('/hospital/getAllList', {
            noEncry: true,
            success: function (res) {
                if (res.code === '01') {
                    // 更新省
                    proviceData = res.data;
                    $('#provinceList').html(getListHtml(proviceData, 'areaCode', 'areaName'));

                    // 更新市、区、乡镇
                    updateCity(0);
                    updateArea(0);
                    updateCountry(areaData[0].areaCode)
                }
            }
        })

        // 更新市
        function updateCity(index) {
            cityData = proviceData[index].areaList;
            cityData.unshift({
                areaCode: '',
                areaName: '全部',
                areaList: []
            })
            $('#cityList').html(getListHtml(cityData, 'areaCode', 'areaName'));
        }

        // 更新区
        function updateArea(index) {
            areaData = cityData[index].areaList;
            areaData.unshift({
                areaCode: '',
                areaName: '全部',
                areaList: []
            })
            $('#areaList').html(getListHtml(areaData, 'areaCode', 'areaName'));
        }

        // 更新乡镇
        function updateCountry(areaCode) {
            http('/hospital/queryCountry', {
                data: {
                    areaCode: areaCode
                },
                success: function (res) {
                    if (res.code === '01') {
                        var countryData = res.data;
                        countryData.unshift({
                            areaCode: '',
                            areaName: '全部',
                            areaList: []
                        })
                        $('#countryList').html(getListHtml(countryData, 'areaCode', 'areaName'));
                    }
                }
            })
        }

        // 选择省
        $('#provinceList').click(function (e) {
            var $selectEle = $(e.target);
            var index = $selectEle.index();
            changeSelected($selectEle);
            // 更新市、区、乡镇
            updateCity(index);
            updateArea(0);
            updateCountry(areaData[0].areaCode);
        })

        // 选择市
        $('#cityList').click(function (e) {
            var $selectEle = $(e.target);
            var index = $selectEle.index();
            changeSelected($selectEle);
            // 更新市、区、乡镇
            updateArea(index);
            updateCountry(areaData[0].areaCode);
        })

        // 选择区
        $('#areaList').click(function (e) {
            var $selectEle = $(e.target);
            var index = $selectEle.index();
            changeSelected($selectEle);
            // 更新市、区、乡镇
            updateCountry(areaData[index].areaCode);
        })

        // 选择乡镇
        $('#countryList').click(function (e) {
            var $selectEle = $(e.target);
            var index = $selectEle.index();
            changeSelected($selectEle);
        })

        // 省市乡镇确认
        $('#areaConfirm').click(function () {
            var departCode = $('#provinceList').find('p.active').attr('data-code');
            var departmentCode = $('#leve2Depart').find('p.active').attr('data-departCode');
            $('[name=provinceCode]').val($('#provinceList').find('p.active').attr('data-code'));
            $('[name=cityCode]').val($('#cityList').find('p.active').attr('data-code'));
            $('[name=areaCode]').val($('#areaList').find('p.active').attr('data-code'));
            $('[name=countryCode]').val($('#countryList').find('p.active').attr('data-code'));

            $('#areaModule').hide();
            $('#main').show();
            getHospitalList();
        })
        // 搜索医院
        $('#toHospital').keypress(function (e) {
            console.log('toHospital')
            if (e.keyCode != 13) return;
            // 清空省市乡镇数据、显示选择医院模块
            $('#hospitalSearch').val($.trim($(this).val()));
            $('[name=provinceCode]').val('');
            $('[name=cityCode]').val('');
            $('[name=areaCode]').val('');
            $('[name=countryCode]').val('');

            $('#areaModule').hide();
            $('#main').show();
            getHospitalList();
        })

        function getHospitalList() {

        }

    </script>
</body>

</html>